<!DOCTYPE html>
<html lang="en">

<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Kirtan Title Finder........</title>
<script src="jquery.js"></script>
<script charset="utf-8" src="kirtanData.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="kirtan.css">
<link rel="stylesheet" type="text/css" href="autoSuggest.css">

<title>Kirtan Title Finder</title>
</head>

<body>
<div id="divContainer">

<div id="kirtanSearchbar"><label for=searchLabel>Type in
some letters or words of the MP3 Kirtan. For exact search, put double
quotes before words</label> <br />
<form autocomplete="off">
	<input type="text" name="search" id="search" placeholder="Type Something" list="searchresults" autocomplete="off"> </input>
	<datalist id="searchresults"></datalist>
<input id="searchBtn" type=submit value=Go>
</form>
</div>
<br />

<div id="kirtanDiv" ><label for=results>Search Results</label> <br />

<UL  width=100% id="searchResults" name="searchResults"><li>TEST</li></UL>
</div>

<br />

<div id="kirtanDiv" style="display: table;"><label for=details>Kirtan
Details</label> <br />
<table width="100%" align="left" style="table-layout: fixed;">

	<tr>
		<td>
		<table id="kirtanDetails">
			<tr>
				<td>Hindi Title:</td>
				<td>अपनापन रखना, मेरे घनश्याम</td>
			</tr>
			<tr>
				<td>English Title:</td>
				<td>apanapan rakhana mere ghanashyam</td>
			</tr>
			<tr>
				<td>Artist:</td>
				<td>Value from excel</td>
			</tr>
			<tr>
				<td>Page Number:</td>
				<td>120</td>
			</tr>
		</table>
		</td>
		<td>
		<table id="kirtanDetails">
			<tr>
				<td>Book:</td>
				<td>Prem Ras Madira</td>
			</tr>
			<tr>
				<td>Part:</td>
				<td>1</td>
			</tr>
			<tr>
				<td>Type:</td>
				<td>E.g. Virah Madhuri</td>
			</tr>
			<tr>
				<td>Pad Number:</td>
				<td>130</td>
			</tr>
		</table>
		</td>
	</tr>
</table>
<br />
</div>

<br />
</div>
</body>
</html>
